<template>
  <div class="app-container">
    <!-- 任务列表 -->
    <el-table
      v-loading="loading"
      :data="taskList"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="标题" prop="title" align="center" />
      <el-table-column label="内容" prop="description" align="center" />
      <el-table-column label="级别" prop="level" align="center" />
      <el-table-column label="状态" prop="status" align="center">
        <template #default="scope">
          {{ showStatus(scope.row.status) }}
        </template>
      </el-table-column>
      <el-table-column label="截止" prop="deadline" align="center" width="180">
        <template #default="scope">
          {{ parseTime(scope.row.deadline, '{y}-{m}-{d}') }}
        </template>
      </el-table-column>
      <el-table-column label="完成" prop="finishTime" align="center" width="180">
        <template #default="scope">
          {{ parseTime(scope.row.finishTime, '{y}-{m}-{d}') }}
        </template>
      </el-table-column>
      <el-table-column label="操作" width="160" align="center">
        <template #default="scope">
          <el-button
            type="primary"
            size="mini"
            @click="handleViewDetail(scope.row)"
          >查看</el-button>
          <el-button
            type="info"
            size="mini"
            @click="handleProcess(scope.row)"
            :disabled="scope.row.status === 2 || scope.row.assigneeId !== userId"
            style="margin-left:8px;"
          >处理</el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- 分页组件 -->
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 任务详情弹窗 -->
    <el-dialog
      title="任务详情"
      :visible.sync="detailVisible"
      width="600px"
      append-to-body
    >
      <el-descriptions :column="1" border>
        <el-descriptions-item label="任务标题">{{ detailTask.title }}</el-descriptions-item>
        <el-descriptions-item label="任务内容">{{ detailTask.description }}</el-descriptions-item>
        <el-descriptions-item label="应急级别">{{ detailTask.level }}</el-descriptions-item>
        <el-descriptions-item label="任务状态">{{ showStatus(detailTask.status) }}</el-descriptions-item>
        <el-descriptions-item label="发布人ID">{{ detailTask.publisherId }}</el-descriptions-item>
        <el-descriptions-item label="责任人ID">{{ detailTask.assigneeId }}</el-descriptions-item>
        <el-descriptions-item label="截止时间">
          {{ parseTime(detailTask.deadline, '{y}-{m}-{d}') }}
        </el-descriptions-item>
        <el-descriptions-item label="完成时间">
          {{ parseTime(detailTask.finishTime, '{y}-{m}-{d}') }}
        </el-descriptions-item>
        <el-descriptions-item label="创建时间">
          {{ parseTime(detailTask.createTime, '{y}-{m}-{d} {h}:{m}:{s}') }}
        </el-descriptions-item>
      </el-descriptions>
      <template #footer>
        <el-button @click="detailVisible = false">关闭</el-button>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import { listMyTask } from '@/api/emergency/task'
import { parseTime } from '@/utils'
import Pagination from '@/components/Pagination'

export default {
  name: 'MyTask',
  components: {
    Pagination
  },
  data() {
    return {
      loading: false,
      ids: [],
      single: true,
      multiple: true,
      total: 0,
      userId: this.$store.state.user.id, // 当前用户ID用于按钮权限
      taskList: [],
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        assigneeId: this.$store.state.user.id
      },
      detailVisible: false,
      detailTask: {}
    }
  },
  created() {
    this.getList()
  },
  methods: {
    // 查询任务列表
    getList() {
      this.loading = true
      listMyTask(this.queryParams).then(res => {
        this.taskList = res.rows
        this.total = res.total
        this.loading = false
      })
    },
    // 多选
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    // 查看详情
    handleViewDetail(row) {
      this.detailTask = { ...row }
      this.detailVisible = true
    },
    // 跳转处理页面
    handleProcess(row) {
      const id = row?.id || this.ids[0]
      // 跳转到C:\Users\许万境\RuoYi-Vue\ruoyi-ui\src\views\emergency\log\index.vue配置的路由
      this.$router.push({ path: '/emergency/log/index', query: { taskId: id } })
    },
    // 状态文本
    showStatus(status) {
      const statusMap = {
        0: '待处理',
        1: '进行中',
        2: '已完成',
        3: '逾期'
      }
      return statusMap[status] || '未知状态'
    },
    parseTime // 若依自带
  }
}
</script>
